
{% extends "base.html" %}
{# Copyright The IETF Trust 2015, All Rights Reserved #}
{% load origin %}
{% load static %}
{% load django_bootstrap5 ietf_filters %}
{% load misc_filters %}
{% block pagehead %}{{ all_forms|merge_media:'css' }}{% endblock %}
{% block title %}{{ title }}{% endblock %}
{% block content %}
    {% origin %}
    <h1>{{ title }}</h1>
    {% if can_change_uses_milestone_dates %}<form class="my-3" method="post" id="switch-date-use-form">{% endif %}
        <a class="btn btn-primary" href="{{ group.about_url }}">{{ group.acronym }} {{ group.type.name }}</a>
        {% if group.charter %}
            <a class="btn btn-primary"
               href="{% url "ietf.doc.views_doc.document_main" name=group.charter.name %}">
                {{ group.charter.name }}
            </a>
        {% endif %}
        {% if can_change_uses_milestone_dates %}
            {% csrf_token %}
            <button class="btn btn-primary {% if milestone_set == 'charter' and not group.charter.rev == '00-00' %} d-none{% endif %}"
                    type="submit"
                    name="action"
                    value="switch">
                {% if group.uses_milestone_dates %}
                    Stop
                {% else %}
                    Start
                {% endif %}
                using milestone dates
            </button>
        {% endif %}
    {% if can_change_uses_milestone_dates %}</form>{% endif %}
    <p class="alert alert-info my-3">
        {% if forms %}Click a milestone to edit it.{% endif %}
        {% if forms and not group.uses_milestone_dates %}Drag and drop milestones to reorder them.{% endif %}
        {% if needs_review %}
            Note that as {{ group.type.name }} Chair you cannot edit descriptions of existing
            milestones and milestones you add are subject to review by the {{ reviewer }}.
        {% endif %}
    </p>
    {% if can_reset %}
        <p>
            You can
            <a href="{% url 'ietf.group.milestones.reset_charter_milestones' group_type=group.type_id acronym=group.acronym %}">
                reset
                this list
            </a>
            to the milestones currently in use for the {{ group.acronym }} {{ group.type.name }}.
        </p>
    {% endif %}
    {% if form_errors %}
        <p class="alert alert-danger my-3">
            There were errors, see below.
        </p>
    {% endif %}
    <form method="post" id="milestones-form">
        {% csrf_token %}
        <div id="dragdropcontainer">
            {% for form in forms %}
                <div class="milestonerow draggable">
                    <hr>
                    <div class="row milestone{% if form.delete.data %} delete{% endif %}">
                        <div class="due handle col-md-2 col-form-label col-form-label-md">
                            {% if form.milestone.resolved %}
                                <span class="badge rounded-pill text-bg-success">{{ form.milestone.resolved }}</span>
                            {% elif group.uses_milestone_dates and form.milestone.due %}
                                <b>{{ form.milestone.due|date:"M Y" }}</b>
                            {% endif %}
                        </div>
                        <div class="col-md-10 col-form-label col-form-label-md">
                            <b>{{ form.milestone.desc|urlize_ietf_docs }}</b>
                            {% if form.needs_review %}
                                <span title="This milestone is not active yet, awaiting {{ reviewer }} acceptance"
                                      class="badge rounded-pill text-bg-warning">
                                    Awaiting accept
                                </span>
                            {% endif %}
                            {% if form.changed %}<span class="badge rounded-pill text-bg-info">Changed</span>{% endif %}
                            {% if form.delete.data %}<span class="badge rounded-pill text-bg-danger">Deleted</span>{% endif %}
                            {% for d in form.docs_names %}<div class="doc">{{ d }}</div>{% endfor %}
                        </div>
                    </div>
                    <div class="d-none row edit-milestone{% if form.changed %} changed{% endif %}">
                        {% include "group/milestone_form.html" %}
                    </div>
                </div>
            {% endfor %}
        </div>
        <div id="extratemplatecontainer" class="d-none">
            <div class="row extratemplate">
                <hr>
                <div class="edit-milestone template">{% include "group/milestone_form.html" with form=empty_form %}</div>
            </div>
        </div>
        <div class="row extrabuttoncontainer">
            <div class="offset-md-2">
                <button type="button" class="btn btn-primary add-milestone">
                    Add extra
                    {% if milestone_set == "chartering" %}charter{% endif %}
                    milestone
                    {% if needs_review %}for {{ reviewer }} review{% endif %}
                </button>
            </div>
        </div>
        <a class="btn btn-secondary float-end"
           href="{% if milestone_set == "charter" %}{% url "ietf.doc.views_doc.document_main" name=group.charter.name %}{% else %}{{ group.about_url }}{% endif %}">
            Cancel
        </a>
        <button class="btn btn-primary hidden"
                type="submit"
                data-labelsave="Save"
                data-labelreview="Review changes">
            Save
        </button>
        <input type="hidden" name="action" value="save">
    </form>
    {% if group.uses_milestone_dates %}<div id="uses_milestone_dates"></div>{% endif %}
{% endblock %}
{% block js %}
    {{ all_forms|merge_media:'js' }}
    {% if not group.uses_milestone_dates %}
        <script src="{% static 'ietf/js/sortable.js' %}"></script>
    {% endif %}
    <script src="{% static 'ietf/js/edit-milestones.js' %}"></script>
{% endblock %}